﻿<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>后台</title>
    <link href="/css/bgindex.css" rel="stylesheet">
    <script type="text/javascript" charset="utf-8" async="" src="/js/manif.js"></script>
    <script type="text/javascript" charset="utf-8" async="" src="/js/stomp.min.js"></script>
    <script type="text/javascript" charset="utf-8" async="" src="/js/tips.min.js"></script>
    <script type="text/javascript" src="/js/vue.js"></script>
</head>
</head>
<body class="">
<div id="app">
    <div data-v-d034c99c="" class=" skin-purple">
        <div data-v-e69e3ce0="" data-v-d034c99c="">
            <header data-v-e69e3ce0="" class="el-header main-header" style="height: 60px;">
                <nav data-v-e69e3ce0="" class="navbar navbar-static-top">
                    <div data-v-e69e3ce0="" class="right-menu">
                        <div data-v-e69e3ce0="" class="avatar-container right-menu-item el-dropdown">
                            <div data-v-e69e3ce0="" class="avatar-wrapper el-dropdown-selfdefine" aria-haspopup="list"
                                 aria-controls="dropdown-menu-5339" role="button" tabindex="0" @click="userButton()">
                                <img src="/img/head.e26cd45.png" class="user-avatar">
                                <span th:text="${username}"></span>
                            </div>
                            <ul data-v-e69e3ce0="" class="el-dropdown-menu el-popper el-dropdown-menu--medium"
                                id="userBody" style="display: none">
                                <li data-v-e69e3ce0="" tabindex="-1"
                                    class="el-dropdown-menu__item el-dropdown-menu__item--divided"><!----><span
                                        data-v-e69e3ce0="" style="display: block;">修改密码</span></li>
                                <li data-v-e69e3ce0="" tabindex="-1"
                                    class="el-dropdown-menu__item el-dropdown-menu__item--divided"><!----><span
                                        data-v-e69e3ce0="" style="display: block;">退出</span></li>
                            </ul>
                        </div>
                    </div>
                    <div data-v-e69e3ce0="" class="topbar-title">
                        <ul data-v-e69e3ce0="" role="menubar" class="el-menu-demo headNav el-menu--horizontal el-menu">
                            <!----><!----><!----><!----><!---->
                            <li data-v-e69e3ce0="" role="menuitem" tabindex="0" class="el-menu-item is-active"
                                router="true"><i data-v-e69e3ce0="" class="iconNav iconCommodity"></i>商品
                            </li>
                        </ul>
                    </div>
                </nav>
            </header>
        </div>
        <div data-v-d034c99c="" class="app-wrapper">
            <div data-v-d034c99c="" class="sidebar-container">
                <div data-v-5132965f="" class="scroll-container">
                    <div data-v-5132965f="" class="scroll-wrapper" style="top: 0px;">
                        <ul role="menubar" class="leftMenu el-menu" data-v-5132965f=""><!----><!----><!----><!---->
                            <!---->
                            <li role="menuitem" aria-haspopup="true" class="el-submenu is-opened" aria-expanded="true">
                                <div class="el-submenu__title" style="padding-left: 20px;"><i
                                        class="el-icon-menu"></i><span slot="title" @click="productM()">商品管理</span><i
                                        class="el-submenu__icon-arrow el-icon-arrow-down"></i></div>
                                <ul id="productM" role="menu" class="el-menu el-menu--inline" data-old-padding-top=""
                                    data-old-padding-bottom="" data-old-overflow="" style="">
                                    <li role="menuitem" tabindex="-1" class="el-menu-item is-active"
                                        style="padding-left: 40px;">
                                        <a onclick="leftNav('productList')">商品列表</a>
                                    </li>
                                    <li role="menuitem" tabindex="-1" class="el-menu-item" style="padding-left: 40px;">
                                        <a onclick="leftNav('addProduct')">添加商品</a>
                                    </li>
                                </ul>
                            </li>
                            <li role="menuitem" aria-haspopup="true" class="el-submenu is-opened"
                                aria-expanded="true">
                                <div class="el-submenu__title" style="padding-left: 20px;"><i
                                        class="el-icon-menu"></i><span slot="title" @click="productP()">商品配置</span><i
                                        class="el-submenu__icon-arrow el-icon-arrow-down"></i></div>
                                <ul id="productP" role="menu" class="el-menu el-menu--inline" data-old-padding-top=""
                                    data-old-padding-bottom="" data-old-overflow="" style="">
                                    <li role="menuitem" tabindex="-1" class="el-menu-item" style="padding-left: 40px;">
                                        <a onclick="leftNav('brandManger')">品牌管理</a>
                                    </li><!----><!---->
                                </ul>
                            </li>
                            <li role="menuitem" aria-haspopup="true" class="el-submenu is-opened"
                                aria-expanded="true">
                                <div class="el-submenu__title" style="padding-left: 20px;"><i
                                        class="el-icon-menu"></i><span slot="title" @click="userP()">用户管理</span><i
                                        class="el-submenu__icon-arrow el-icon-arrow-down"></i></div>
                                <ul id="userM" role="menu" class="el-menu el-menu--inline" data-old-padding-top=""
                                    data-old-padding-bottom="" data-old-overflow="" style="">
                                    <li role="menuitem" tabindex="-1" class="el-menu-item" style="padding-left: 40px;">
                                        <a onclick="leftNav('userList')">用户列表</a>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div data-v-d034c99c="" class="main-container">
                <section data-v-d034c99c="" class="app-main" style="min-height: 100%;">
                    <div data-v-9d0c3f1c="" class="dashboard-container">
                        <div data-v-9d0c3f1c="" class="app-container">
                            <div data-v-9d0c3f1c="" class="seacthBox">
                                <form data-v-9d0c3f1c="" class="el-form el-form--inline">
                                    <div data-v-9d0c3f1c="" class="el-form-item el-form-item--medium">
                                        <label for="name" class="el-form-item__label">输入搜索</label>
                                        <div class="el-form-item__content">
                                            <div data-v-9d0c3f1c="" class="el-input el-input--medium">
                                                <input type="text" autocomplete="off" placeholder="商品名称"
                                                       class="el-input__inner">
                                            </div>
                                        </div>
                                    </div>
                                    <div data-v-9d0c3f1c="" class="el-form-item el-form-item--medium">
                                        <label for="brandId" class="el-form-item__label">商品品牌</label>
                                        <div class="el-form-item__content">
                                            <div data-v-9d0c3f1c="" class="el-select el-select--medium">
                                                <div class="el-input el-input--medium el-input--suffix">
                                                    <input type="text" readonly="readonly" autocomplete="off"
                                                           placeholder="请选择品牌" class="el-input__inner">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div data-v-9d0c3f1c="" class="el-form-item el-form-item--medium">
                                        <div class="el-form-item__content">
                                            <button data-v-9d0c3f1c="" type="button"
                                                    class="el-button el-button--primary el-button--medium">
                                                <span>查询</span></button>
                                            <button data-v-9d0c3f1c="" type="button"
                                                    class="el-button el-button--default el-button--medium">
                                                <span>重置</span></button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                            <div data-v-9d0c3f1c="" class="basic-list-content">
                                <div data-v-9d0c3f1c=""
                                     class="el-table el-table--fit el-table--border el-table--scrollable-x el-table--enable-row-transition el-table--medium"
                                     style="width: 100%; margin-top: 10px;">
                                    <div class="el-table__header-wrapper">
                                        <table cellspacing="0" cellpadding="0" border="0" class="el-table__header"
                                               style="width: 1475px;">
                                            <colgroup>
                                                <col name="el-table_1_column_1" width="55">
                                                <col name="el-table_1_column_2" width="130">
                                                <col name="el-table_1_column_3" width="120">
                                                <col name="el-table_1_column_4" width="240">
                                                <col name="el-table_1_column_5" width="110">
                                                <col name="el-table_1_column_6" width="110">
                                                <col name="el-table_1_column_7" width="160">
                                                <col name="el-table_1_column_8" width="180">
                                                <col name="el-table_1_column_9" width="200">
                                                <col name="gutter" width="0">
                                            </colgroup>
                                            <tbody>
                                            <tr class="">
                                                <th colspan="1" rowspan="1"
                                                    class="el-table_1_column_1   el-table-column--selection  is-leaf">
                                                    <div class="cell"><label class="el-checkbox"><span
                                                            class="el-checkbox__input"><span
                                                            class="el-checkbox__inner"></span><input type="checkbox"
                                                                                                     aria-hidden="false"
                                                                                                     class="el-checkbox__original"
                                                                                                     value=""></span>
                                                        <!----></label></div>
                                                </th>
                                                <th colspan="1" rowspan="1" class="el-table_1_column_2     is-leaf">
                                                    <div class="cell">编号</div>
                                                </th>
                                                <th colspan="1" rowspan="1"
                                                    class="el-table_1_column_3  is-center   is-leaf">
                                                    <div class="cell">商品图片</div>
                                                </th>
                                                <th colspan="1" rowspan="1" class="el-table_1_column_4     is-leaf">
                                                    <div class="cell">商品名称</div>
                                                </th>
                                                <th colspan="1" rowspan="1" class="el-table_1_column_5     is-leaf">
                                                    <div class="cell">价格/货号</div>
                                                </th>
                                                <th colspan="1" rowspan="1"
                                                    class="el-table_1_column_6  is-center   is-leaf">
                                                    <div class="cell">标签</div>
                                                </th>
                                                <th colspan="1" rowspan="1" class="el-table_1_column_7     is-leaf">
                                                    <div class="cell">销量</div>
                                                </th>
                                                <th colspan="1" rowspan="1"
                                                    class="el-table_1_column_8  is-center   is-leaf">
                                                    <div class="cell">审核状态</div>
                                                </th>
                                                <th colspan="1" rowspan="1"
                                                    class="el-table_1_column_9  is-center   is-leaf">
                                                    <div class="cell">操作</div>
                                                </th>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                    <div class="el-table__body-wrapper">
                                        <table cellspacing="0" cellpadding="0" border="0" class="el-table__body"
                                               style="width: 1475px;">
                                            <tbody>
                                            <tr class="el-table__row" v-for="good in goods" :key="goods.index">
                                                <td rowspan="1" colspan="1"
                                                    class="el-table_2_column_10  el-table-column--selection"
                                                    style="width:44px;text-align: center">
                                                    <div class="cell">
                                                        <label class="el-checkbox">
                                                        <span class="el-checkbox__input">
                                                            <span class="el-checkbox__inner"></span>
                                                            <input type="checkbox" aria-hidden="false"
                                                                   class="el-checkbox__original" value="">
                                                        </span>
                                                        </label>
                                                    </div>
                                                </td>
                                                <td rowspan="1" colspan="1" class="el-table_2_column_11  "
                                                    style="width:100px;text-align: center">
                                                    <div class="cell">{{good.skuList[0].id}}</div>
                                                </td>
                                                <td rowspan="1" colspan="1" class="el-table_2_column_12 is-center "
                                                    style="width:100px;text-align: center">
                                                    <div class="cell">
                                                        <span data-v-9d0c3f1c="" class="imageSet">
                                                            <img data-v-9d0c3f1c=""
                                                                 :src="good.skuList[0].image">
                                                        </span>
                                                    </div>
                                                </td>
                                                <td rowspan="1" colspan="1" class="el-table_2_column_13  "
                                                    style="width:170px;text-align: center">
                                                    <div class="cell">{{good.skuList[0].name}}</div>
                                                </td>
                                                <td rowspan="1" colspan="1" class="el-table_2_column_14  "
                                                    style="width:100px;text-align: center">
                                                    <div class="cell">{{good.skuList[0].price}}</div>
                                                </td>
                                                <td rowspan="1" colspan="1" class="el-table_2_column_15 "
                                                    style="width:100px;text-align: center">
                                                    <div class="cell">
                                                        <div id="checkedCore" data-v-9d0c3f1c="" role="switch"
                                                             class="el-switch is-checked" aria-checked="true">
                                                            <button data-v-9d0c3f1c="" type="button"
                                                                    @click="Checked(good.skuList[0].id,good.spu.isMarketable,page)"
                                                                    class="el-button el-button--text el-button--small">
                                                                <span>
                                                                {{good.spu.isMarketable==1?"上架":good.spu.isMarketable==0?"下架":"解锁"}}
                                                                </span>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </td>
                                                <td rowspan="1" colspan="1" class="el-table_2_column_16  "
                                                    style="width:160px;text-align: center">
                                                    <div class="cell">{{good.skuList[0].saleNum}}</div>
                                                </td>
                                                <td rowspan="1" colspan="1" class="el-table_2_column_17 is-center "
                                                    style="width:180px;text-align: center">
                                                    <div class="cell">
                                                        <button data-v-9d0c3f1c="" type="button"
                                                                @click="Checked(good.skuList[0].id,good.skuList[0].status,page)"
                                                                class="el-button el-button--text el-button--small">
                                                                <span>
                                                            {{good.skuList[0].status==1?"已审核":good.skuList[0].status==0?"未审核":"解锁"}}
                                                         </span>
                                                        </button>
                                                    </div>
                                                </td>
                                                <td rowspan="1" colspan="1"
                                                    class="el-table_2_column_18 is-center"
                                                    style="width:200px">
                                                    <div class="cell">
                                                        <button data-v-9d0c3f1c="" type="button"
                                                                class="el-button el-button--text el-button--small"
                                                                @click="dele(good.skuList[0].id,page)">
                                                            <!----><!----><span>删除</span></button>
                                                    </div>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
                <div>
                    到<input v-model="page">页
                    <button @click="queding(page)">确定</button>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="/js/init.js" async="async" id="data-rollback"></script>
<link rel="stylesheet" type="text/css" href="/css/notif.css">
<script src="/js/axios.js"></script>
<script src="/js/jquery.min.js"></script>
<script th:inline="javascript">
    var app = new Vue({
        el: "#app",
        data: {
            goods: [[${goods}]],
            page: [[${page}]],
        },
        methods: {
            userButton: function () {
                var userBody = document.getElementById("userBody");
                if (userBody.style.display == 'none') {
                    userBody.style.display = 'block';
                } else {
                    userBody.style.display = 'none';
                }
            },
            Checked: function (id, isMarketable) {
                axios.get("/bg/isMarketable?id=" + id + "&&isMarketable=" + isMarketable).then(function (response) {
                    if (response.data) {
                        this.data = response.data
                    }
                })
            },
            Status: function (id, status) {
                axios.get("/bg/status?id=" + id + "&&status=" + status).then(function (response) {
                    if (response.data) {
                        this.data = response.data
                    }
                })
            },
            productM: function () {
                var productM = document.getElementById("productM")
                if (productM.style.display == 'none') {
                    productM.style.display = 'block';
                } else {
                    productM.style.display = 'none';
                }
            },
            productP: function () {
                var productP = document.getElementById("productP")
                if (productP.style.display == 'none') {
                    productP.style.display = 'block';
                } else {
                    productP.style.display = 'none';
                }
            },
            userP: function () {
                var userP = document.getElementById("userP")
                if (userP.style.display == 'none') {
                    userP.style.display = 'block';
                } else {
                    userP.style.display = 'none';
                }
            },
            queding: function (page) {
                axios.get("/bg/goods?page=" + page).then(res => {
                    if (res) {
                        this.$data.goods = res.data;
                    }
                }).catch(err => {
                    console.log(err)
                })
            }
        },
        dele: function (id, page) {
            axios.get("/bg/logic/delete?id=" + id + "&&page=" + page).then(res => {
                if (res.data) {
                    this.data.goods = res.data
                }
            })
        }
    })
</script>
<script>
    page = [[${page}]];

    function leftNav(url) {
        $.ajax({
            type: "get",
            url: '/bg/' + url + "?page=" + page,
            async: true,
            dataType: "html",
            contentType: 'application/json; charset=utf-8',
            success: function (html) {
                $('.main-container').html(html);
                //$('#right').load(url);//load函数同样能实现效果
            }
        });
    }
</script>
</body>
</html>